<template>
  <div>
    <el-form v-model="shop" ref="shopForm" label-position="left" label-width="100px" class="demo-ruleForm login-container">
      <h3 class="title">店铺入驻</h3>
      <el-form-item prop="name"label="名称">
        <el-input type="text" v-html="shop.name" auto-complete="off" placeholder="请输入店铺名称！"></el-input>
      </el-form-item>
      <el-form-item prop="tel" label="座机">
        <el-input type="text" v-html="shop.tel" auto-complete="off" placeholder="请输入座机！"></el-input>
      </el-form-item>
      <el-form-item prop="address" label="店铺地址">
        <el-input type="text" style="width: 350px" v-html="shop.address" auto-complete="off" placeholder="请输入地址！"></el-input>
      </el-form-item>
      <el-form-item prop="logo" label="店铺Logo">
        <el-input type="text" style="width: 350px" v-html="shop.logo" auto-complete="off" placeholder="请输入logo"></el-input>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click.native="activation">激活</el-button>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      shop: {},
    };
  },
  methods: {
    getShop(){
      this.$http.get("/shop/"+this.$route.query.shopId)
        .then(result => {
          this.shop = result.data;
        })
       .catch(result => {
         this.$message("系统繁忙,请稍后重试!")
       })

    },
    activation(){
          this.$confirm('确认激活吗？', '提示', {}).then(() => {
            this.$http.put("/shop/active/"+this.$route.query.shopId).then((res) => {
              if(res.data.success){
                this.$message({
                  message: '操作成功!',
                  type: 'success'
                });
                //跳转登录页面
                this.$router.push({ path: '/login' });
              }
              else{
                this.$message({
                  message: res.data.message,
                  type: 'error'
                });
              }

            });
          });
    }
  },

  mounted() {
    this.getShop();
  }
}

</script>
<style lang="scss" scoped>
.login-container {
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-border-radius: 5px;
  background-clip: padding-box;
  margin: 180px auto;
  width: 500px;
  padding: 35px 35px 15px 35px;
  background: #fff;
  border: 1px solid #eaeaea;
  box-shadow: 0 0 25px #cac6c6;
  .title {
    margin: 0px auto 40px auto;
    text-align: center;
    color: #505458;
  }
  .remember {
    margin: 0px 0px 35px 0px;
  }
}

.map {
  width: 100%;
  height: 300px;
}
.searchinput{
  width: 300px;
  box-sizing: border-box;
  padding: 9px;
  border: 1px solid #dddee1;
  line-height: 20px;
  font-size: 16px;
  height: 38px;
  color: #333;
  position: relative;
  border-radius: 4px;
}
</style>